import * as THREE from 'three';
import Render from "./Render";

export default class SideRenderView extends Render {
  container;
  pointCloud;
  width;
  height;
  renderer;
  camera;
  cameraHelper;
  // object;
  // projectRect;
  axis;
  alignAxis;
  paddingPercent;
  needFit = true;
  enableFit = true;
  // material: THREE.ShaderMaterial;
  selectColor = new THREE.Color(0, 1, 0);
  boxInvertMatrix = new THREE.Matrix4();
  zoom = 1;
  cameraOffset = new THREE.Vector3();

  constructor(container, pointCloud, config = {}) {
    super(config.name || '');
    let { axis = 'z', paddingPercent = 1 } = config;

    this.container = container;
    this.pointCloud = pointCloud;

    this.axis = axis;
    this.alignAxis = new THREE.Vector3();
    this.setAxis(axis);

    this.paddingPercent = paddingPercent;

    this.width = this.container.clientWidth;
    this.height = this.container.clientHeight;

    // renderer
    this.renderer = new THREE.WebGLRenderer({ antialias: true });
    this.renderer.autoClear = false;
    this.renderer.sortObjects = false;
    this.renderer.setPixelRatio(pointCloud.pixelRatio);
    this.renderer.setSize(this.width, this.height);
    this.container.appendChild(this.renderer.domElement);

    this.camera = new THREE.OrthographicCamera(-2, 2, 2, -2, 0, 10);
    this.pointCloud.scene.add(this.camera);

    // helper
    let camera = this.camera;
    // camera.lookAt(0, 0, 0);
    const helper = new THREE.CameraHelper(camera);
    // this.pointCloud.scene.add(helper);
    this.cameraHelper = helper;
  }

  setAxis(axis) {
    this.axis = axis;
    this.alignAxis.set(0, 0, 0);

    let axisValue = this.axis.length === 2 ? this.axis[1] : this.axis[0];
    let isInverse = this.axis.length === 2;
    this.alignAxis[axisValue] = isInverse ? -0.5 : 0.5;

    // if (this.object) this.fitObject();

    this.render();
  }
}